<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title></title>
<%@ include file="/WEB-INF/views/include/easyui.jsp"%>
<style>
	.text-titel{
		text-align:right;
	}
</style>
</head>
<body>
	<div>
		<form id="mainform" action="<%=path%>/generator/buildAutoForm"
			method="post">
			<table class="formTable" style="width: 99%;">
				<tr>
					<td>表名：</td>
					<td><input type="hidden" name="id" value="${tableModel.id }" />
						<input type="text" name="gtableName"
						value="${tableModel.gtableName }" class="easyui-validatebox"
						readonly="readonly" style="width:137px;"/></td>
					<td>表描述：</td>
					<td><input type="text" name="gtableComment"
						value="${tableModel.gtableComment }" class="easyui-validatebox"
						required="required" style="width:137px;"/></td>

				</tr>
				<tr>
					<td>主键规则：</td>
					<td><select id="gkeyPolicy" name="gkeyPolicy"
						data-options="editable:false" dvalue="${tableModel.gkeyPolicy}"
						class="easyui-combobox"   required="true"
        validType="selectValueRequired['#gkeyPolicy']" style="width:145px;">
							<option value="">---请选择生成规则---</option>
							<option value="1">GUID</option>
							<option value="2">SEQ</option>
					</select>
					
					</td>
					<td>表单风格：</td>
					<td><select id="gtableStyle" name="gtableStyle" data-options="editable:false"
						dvalue="${tableModel.gtableStyle}" class="easyui-combobox" style="width:145px;  required="true"
        validType="selectValueRequired['#gtableStyle']">
							<option value="">---请选择表单风格---</option>
							<option value="1">easyUI</option>
					</select></td>
				</tr>
				<tr id="seq"><td>SEQ名称：</td>
					<td><input type="text" style="width:137px;" id="seqVal" class="easyui-validatebox" name="seqVal" value="${tableModel.seqVal}" /> </td>
					<td></td>
					<td></td>
				</tr>
				<tr>
					<td>弹出层宽度:</td>
					<td><input type="text" style="width:137px;" id="winWidth" class="easyui-validatebox" name="winWidth" value="${tableModel.winWidth}" /> </td>
					<td>弹出层高度:</td>
					<td><input type="text" style="width:137px;" id="winHeight" class="easyui-validatebox" name="winHeight" value="${tableModel.winHeight}" /> </td>
				</tr>
				
				<tr>
					<td>Session Name:</td>
					<td><input type="text" style="width:137px;" id="sessionVal" class="easyui-validatebox" name="sessionVal" value="${tableModel.sessionVal}" /></td>
					<td></td>
					<td></td>
				</tr>
				<tr>
					<td>导入功能:</td>
					<td><select id="isUpload" name="isUpload"
						data-options="editable:false" dvalue="${tableModel.isUpload}" 
					class="easyui-combobox" style="width:145px;  required="true" validType="selectValueRequired['#isUpload']">
							<option value="">是否需要加导入功能</option>
							<option value="0">否</option>
							<option value="1">是</option>
					</select></td>
					<td>导出功能:</td>
					<td><select id="isDownload" name="isDownload"
						data-options="editable:false" dvalue="${tableModel.isDownload}" 
					class="easyui-combobox"  style="width:145px; required="true" validType="selectValueRequired['#isDownload']">
							<option value="">是否需要加导出功能</option>
							<option value="0">否</option>
							<option value="1">是</option>
					</select></td>
				</tr>
				<tr>
					<td>编辑框风格:</td>
					<td><select id="editStyle" name="editStyle"
						data-options="editable:false" dvalue="${tableModel.editStyle}" 
					class="easyui-combobox"  style="width:145px; required="true" validType="selectValueRequired['#editStyle']">
							<option value="">-请选择编辑框风格--</option>
							<option value="0">一列</option>
							<option value="1">二列</option>
					</select></td>
					<td>显示查询框:</td>
					<td><select id="isSearch" name="isSearch"
						data-options="editable:false" dvalue="${tableModel.isSearch}" 
					class="easyui-combobox"  style="width:145px; required="true" validType="selectValueRequired['#isSearch']">
							<option value="">---是否显示查询框---</option>
							<option value="0">不显示</option>
							<option value="1">显示</option>
					</select></td>
				</tr>
				<tr>
					<td>显示复选框：</td>
					<td><select id="showCheckbox" name="showCheckbox"
						data-options="editable:false" dvalue="${tableModel.showCheckbox}" 
					class="easyui-combobox" style="width:145px;  required="true" validType="selectValueRequired['#showCheckbox']">
							<option value="">---是否显示复选框---</option>
							<option value="0">不显示</option>
							<option value="1">显示</option>
					</select></td>
					<td>分页：</td>
					<td><select id="isPage" name="isPage"
						data-options="editable:false" dvalue="${tableModel.isPage}" class="easyui-combobox" style="width:145px;  required="true" validType="selectValueRequired['#isPage']">
							<option value="">---数据表是否分页---</option>
							<option value="0">不分页</option>
							<option value="1">分页</option>
					</select></td>

				</tr>
				
				<tr>
					<td>查询SQL：</td><td colspan="3">
						<input type="text" name="sqlVal"  value="${tableModel.sqlVal }" style="width:100%;height:32px" />
					</td>
				</tr>
				<tr>
					<td colspan="1">EasyUI 条件设置行背景颜色:</td>
					<td colspan="3">
						<textarea  style="width:100%;height:32px">${tableModel.rowFormmat}</textarea>
					</td>
				</tr>

			</table>
		</form>

		<div class="easyui-tabs" style="width:985px;height:auto">
			<div title="页面配置" style="padding:10px">
				<table class="formTable" style="width: 99%;" id="baseTable">
					<tr>
						<th>列名</th>
						<th>列备注</th>
						<th>数据类型</th>
						<th>字段长度</th>
						<th>列表</th>
						<th>表单</th>
						<th>输入框类型</th>
						<th>查询</th>
						<th>查询类型</th>
						<th>验证规则</th>
						<th>顺序</th>
					</tr>
					<c:forEach items="${cols}" var="col">
						<tr class="tablecols">
							<input type="hidden" value="${col.id}" name="id" class="colinput" />
							<input type="hidden" value="${col.tableId}" name="tableId"
								class="colinput" />
							<td><input type="text" value="${col.colName}" name="colName"
								readonly="readonly" class="colinput" /></td>
							<td><input type="text" value="${col.colComment}"
								name="colComment" class="easyui-validatebox colinput"
								required="required" /></td>
							<td><input type="text" class="colinput"
								value="${col.dataType}" style="width: 70px;" name="dataType"
								readonly="readonly" /></td>
							<td><input type="text" name="dataLength" style="width: 70px;" class="colinput" readonly="readonly"
								value="${col.dataLength}" /></td>
							<td><input type="checkbox" name="listShow" class="colinput"
								value="${col.listShow}" /></td>
							<td><input type="checkbox" name="formShow" class="colinput"
								value="${col.formShow}" /></td>
							<td><select name="inputType" data-options="editable:false"
								dvalue="${col.inputType}" class="easyui-combobox">
									<option value="">请选择</option>
									<option value="1">文本框</option>
									<option value="2">日期框</option>
									<option value="3">日期+时间</option>
									<option value="4">文本域</option>
									<option value="5">下拉框</option>
									<option value="6">文件框</option>
							</select></td>
							
							<td><input type="checkbox" name="isSearch" class="colinput"
								value="${col.isSearch}" /></td>
							<td><select name="searchType" data-options="editable:false"
								dvalue="${col.searchType}" class="easyui-combobox">
									<option value="">请选择</option>
									<option value="1">等值</option>
									<option value="2">范围</option>
									<option value="3">likeright</option>
									<option value="4">likeall</option>
							</select></td>
							<td><select name="validateRules" data-options="editable:false"
								dvalue="${col.validateRules}" class="easyui-combobox">
									<option value="">请选择</option>
									<option value="required:true">非空</option>
									<option value="validType:\'email\'">邮箱</option>
									<option value="validType:\'url\'">URL</option>
		
							</select></td>
							<td><input type="text" value="${col.sortNum}" class="colinput"
								style="width: 35px;" name="sortNum"  /></td>
						</tr>
					</c:forEach>
				</table>
			</div>
			<div title="字典配置" 
				style="padding: 10px; ">
				<table class="formTable" style="width: 99%;" id="dic">
					<tr><th>列名</th><th>字典表名</th><th>valueField</th><th>textField</th><th>自定义JSON</th><th>列扩展</th></tr>
					<c:forEach items="${cols}" var="col">
						<tr class="tablecols">
							<input type="hidden" value="${col.id}" name="colId" class="colinput" />
							<input type="hidden" value="${col.dicId}" name="id" class="colinput" />
							<td><input type="text" name="colName" value="${col.colName}" class="colclean"  style="height:40px;" disabled="disabled" /></td>
							<td><input type="text" name="dicTable" value="${col.dicTable}" class="colinput" style="width: 70px;height:40px" /></td>
							<td><input type="text" name="dicTableKey" value="${col.dicTableKey}" class="colinput" style="width: 70px;height:40px" /></td>
							<td><input type="text" name="dicTableText"  value="${col.dicTableText}" class="colinput"  style="width: 70px;height:40px"/></td>
							<td><textarea name="dicJson"  style="width:140px;height:40px" class="colinput">${col.dicJson}</textarea></td>
							<td><textarea name="colFormat" style="width:140px;height:40px"class="colinput">${col.colFormat}</textarea></td>
							
						</tr>
					</c:forEach>
				</table>	
			</div>
			<div title="列表配置"
				style="padding: 20px;">
				<table class="formTable" style="width: 99%;" id="tabExt">
					<tr><th>列名</th><th>输入框宽度</th><th>输入框高度</th><th>允许编辑</th><th>默认值</th><th>分组名</th></tr>
					<c:forEach items="${cols}" var="col">
						<tr class="tablecols">
							<input type="hidden" value="${col.id}" name="colId" class="colinput" />
							<input type="hidden" value="${col.extId}" name="id" class="colinput" />
							<td><input type="text" name="colName" value="${col.colName}" class="colclean"  disabled="disabled" /></td>
							<td><input type="text" name="colWidth" value="${col.colWidth}" class="colinput"/></td>
							<td><input type="text" name="colHeight" value="${col.colHeight}" class="colinput" /></td>
							<td><input type="checkbox" name="isEditor" value="${col.isEditor}" class="colinput" /> </td>
							<td><input type="text" name="defaultVal" value="${col.defaultVal}" class="colinput"/></td>
							<td><input type="text" name="groupName" value="${col.groupName}"  class="colinput" /></td>
						</tr>
					</c:forEach>
				</table>
			</div>
			
		</div>
		
	</div>
	<script type="text/javascript">
	$.extend($.fn.validatebox.defaults.rules, {
        selectValueRequired: {
            validator: function(value,param){
                //console.info($(param[0]).find("option:contains('"+value+"')").val());
                //return $(param[0]).find("option:contains('"+value+"')").val() != '';
                return $(param[0]).combobox('getValue')!='' && $(param[0]).combobox('getValue')!=null
            },
            message: 'select value required.'
        }
    });
	</script>
	<script type="text/javascript">
		$(function() {
			var action = "${action}";
			$('select').each(function() {
				$(this).val($(this).attr("dvalue"));
			});
			if($("#gkeyPolicy").attr("dvalue")=="2"){
				
	        	   $("#seq").show();
			}else{
				 
	        	 $("#seq").hide();
			}
			$("#gkeyPolicy").combobox({  
			       onSelect: function () {  
			           var selectVal = $("#gkeyPolicy").combobox('getValue');
			           if (selectVal == "2") {  
			        	  
			        	   $("#seq").show();
			           }  
			           else {  
			        	   $("#seq").hide();
			           }  
			       }  
			   })
			initCheckBox();
			$('#mainform').form({
				onSubmit : function(param) {

					var isValid = $(this).form('validate');
					param.baseTable = getCols("baseTable");
					param.dic = getCols("dic");
					param.tabExt = getCols("tabExt");
					return isValid; // 返回false终止表单提交
				},
				success : function(data) {
					if (successTip(data, dg, d))
						dg.treegrid('reload');
				}
			});
		});

		function initCheckBox() {
			$("input[type='checkbox']").each(function() {
				if ($(this).val() == 1) {
					$(this).attr("checked", "true");
				} else {
					$(this).removeAttr("checked");
				}
			})
		}
		function refCheckBox() {
			$("input[type='checkbox']").each(function() {
				if ($(this).prop('checked')) {
					$(this).val("1");
				} else {
					$(this).val("0");
				}
			})

		}
		function getCols(id) {
			refCheckBox();
			var tableArr = []; //存所有数据
			$("#"+id+" .tablecols").each(
					function() {
						var trArr = []; //存行数据

						$(".colinput", this).each(function() { //便利行内的input select的值
									if(typeof($(this).attr("name"))!="undefined"){ 
									trArr.push("'" + $(this).attr("name")
											+ "':'" + $(this).val() + "'");
									}
						});
						
						$(".easyui-combobox", this).each(
								function() {
									trArr.push("'" + $(this).attr("comboname")
											+ "':'"
											+ $(this).combobox('getValues')
											+ "'");
								});
						tableArr.push("{" + trArr.join() + "}"); //行数据格式
					})
			var value = tableArr.join();
			value = "[" + value + "]";
			console.log(id+":"+value);
			return value;
		}
	</script>
</body>
</html>